<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title><%= ctrl.site %></title>
	<meta name="viewport" content="width=device-width, initial-scale=1"/>
	<link rel="stylesheet" href="/base.css">
	<script src="/base.js"></script>
	<script src="/timeago.min.js"></script>
</head>
<body>
	<section class="top">
		<div class="view-width">
			<div class="top-nav-right">
				<% if(!ctrl.me_login) {%>
					<li><button onclick="show_box('l')" class="good-button-top" >Login</button></li>
					<li><button onclick="show_box('r')" class="good-button-top" >Rigist</button></li>
				<% }else {%>
					<li><a href=<%= "javascript:show_box('"+ctrl.me_id+"')" %> ><%= ctrl.me_nickname %></a></li>
				<% }%>
				<div id="login-box">
				</div>
			</div>
			<div class="top-nav-left">
				<li title="logo"><h1>LATTE FORUM 1.1</h1></li>
			</div>
		</div>
	</section>
	<section class="banner">
		<div class="view-width">
			<div class="banner-nav-right">
				<li><input type="text" class="less-width-searcher"><button>Search</button></li>
				<li><a href="/editor"><button>Add</button></a></li>
			</div>
			<div class="banner-nav" >
					<li><a href="/" title="home page" style="font-weight: 300;">new</a></li>
				<% for(var i in ctrl.nav_topic)  {%>
					<li><a style="font-weight: 300;" href=<%= '/topic/'+ctrl.nav_topic[i]+'/0' %> ><%= ctrl.nav_topic[i] %></a></li>
				<% }%>
			</div>
		</div>
	</section>
	<section class="main">
		<div class="view-width">
			<ul class="posts-ul">
				<% if (docs.length) {%>
					<% for(var i in docs) {%>
						<% if(docs[i]) {%>
							<li>
								<p>
									<% if(ctrl.topic) {%>
										<a href= <%= '/post/' +docs[i]['_id'] +'/0?t='+ ctrl.topic %> class="a-no-underline">
									<% }else {%>				
										<a href= <%= '/post/' +docs[i]['_id'] +'/0' %> class="a-no-underline">
									<% }%>
											<span><%= docs[i]['title'] %></span>
										</a>
										<span class="light">Follow:<%= docs[i]['reply_n'] %></span>
										<span class="light">Read:<%= docs[i]['viewed'] %></span>
										<span class="light good-time"><%= docs[i]['date'] %></span>
								</p>
								<% if(ctrl.abstract && docs[i].content) {%>
									<!-- will without transfer -->
									<div class="abstract">
										<%# docs[i]['content'].slice(0,ctrl.abstract_len) BUG! %>
										<%- docs[i]['content'] %>
									</div>
								<% }%>
							</li>
						<% }%>
					<% }%>
				<% }else {%>
					<li class="no-more"> No more post </li>
				<% }%>
			</ul>
			<div id="pager" style="text-align: center;font-size: larger;">
				<li><a href=<%= '/page/'+(parseInt(ctrl.page)).toString() %> >&lt;</a></li>
				<li><input id="pager_numb" type="text" class="less-width" placeholder=<%= (parseInt(ctrl.page)+1).toString() %> >
					<button onclick="go_page()">Go</button></li>
				<li><a href=<%= '/page/'+(parseInt(ctrl.page)+2).toString() %> >&gt;</a></li>
			</div>
		</div>
	</section>
	<section class="foot">
		<div class="view-width">
			<a href='https://gitee.com/ang111/latte'><img src='https://gitee.com/ang111/latte/widgets/widget_3.svg' alt='Fork me on Gitee'></img></a>
		</div>
	</section>
	<style type="text/css">
		html {
			font-size: 1.2rem;
		}
	</style>
</body>
</html>